/* 
    Document   : main
    Created on : 18-févr.-2012, 16:23:53
    Author     : Pierre Buvé & Nicolas Van Damme
    Description:
        Purpose of the stylesheet follows.
*/

root { 
    display: block;
}
body{
    background-color:#f1f1f1;  
}

#session{
    float: right;
}

.bannerlink{
    padding: 10px;
    background-color: #7878d7 ;
    margin : 0px;
    font-weight: bold;
}
.bannerlink a:link {
    font-size:1.5em;
    background: transparent;
    padding: 5px;
    color:#000;
    border:0px;
    text-decoration:none;
}
.bannerlink a:visited {
    font-size:1.5em;
    background: transparent;
    color:#000;
    border:0px;
    text-decoration:none;
}
.bannerlink a:hover {
    font-size:1.5em;
    background: transparent;
    color:#94c4ef;
    border:0px;
    text-decoration:none;
}



a:link {
    background:#0459b7;
    background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
    background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
    border:1px solid #093c75;
    border-radius:3px;
    color:#fff;
    cursor:pointer;
    font-family:Arial,sans-serif;
    font-size:12px;
    font-weight:bold;
    padding: 5px 10px;
    text-decoration:none;
    text-shadow:0 1px 1px #333;
    text-transform:uppercase;
}
a:visited {
    background:#0459b7;
    background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
    background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
    border:1px solid #093c75;
    border-radius:3px;
    color:#fff;
    cursor:pointer;
    font-family:Arial,sans-serif;
    font-size:12px;
    font-weight:bold;
    padding: 5px 10px;
    text-decoration:none;
    text-shadow:0 1px 1px #333;
    text-transform:uppercase;
}
a:hover {
    background:#08adff;
    background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
    background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
    border-color:#093c75;
    text-decoration:none;
}

submit {
    background:#0459b7;
    background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
    background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
    border-radius:3px;
    color:#fff;
    cursor:pointer;
    font-family:Arial,sans-serif;
    font-size:12px;
    font-weight:bold;
    padding: 5px 10px;
    text-decoration:none;
    text-shadow:0 1px 1px #333;
    text-transform:uppercase;
}
submit :active,submit :focus {
    background:#ccc;
    background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
    background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
    outline:none;
}
submit :hover {
    background:#08adff;
    background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
    background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
    text-decoration:none;
}
submit :visited{
    color: #fff;
}

#timer{
    font-size: 1.5em;
    font-weight: bold;
}

h2 {
    background-color: #94c4ef ;
    padding: 10px;
    margin : 0px;
}


.tablegame{
    background:url(../images/fond.jpg);
}

td{
    background-repeat: no-repeat;
    background-position: center;
}

/*Case vide du plateau de jeu*/
td.empty{
    background-image:url(../images/empty.png); 
    border-style: outset;
}
/*Case vide de la ligne courante*/
td.currentempty{
    background-image:url(../images/empty.png); 
    border-style: outset;
}

/*Pions pour afficher la réponse*/
td.pempty{
    background-image:url(../images/pempty.png); 
    border-style: outset;
}
td.pblanc{
    background-image:url(../images/pblanc.png); 
    border-style: outset;   
}
td.pnoir{
    background-image:url(../images/pnoir.png); 
    border-style: outset; 
}

/*Pion non-daggable pour afficher les couleurs de la solution et du model */
td.rouge{
    background-image:url(../images/rouge.png); 
    border-style: outset;
}
td.vert{
    background-image:url(../images/vert.png); 
    border-style: outset;
}
td.bleu{
    background-image:url(../images/bleu.png); 
    border-style: outset;
}
td.mauve{
    background-image:url(../images/mauve.png); 
    border-style: outset;
}
td.orange{
    background-image:url(../images/orange.png); 
    border-style: outset;
}
td.jaune{
    background-image:url(../images/jaune.png); 
    border-style: outset;
}
td.noir{
    background-image:url(../images/noir.png); 
    border-style: outset;
}
td.blanc{
    background-image:url(../images/blanc.png); 
    border-style: outset;
}

/*Pion daggable pour afficher les couleurs disponibles */
td.Prouge{
    background-image:url(../images/rouge.png); 
    border-style: outset;
}

td.Pvert{
    background-image:url(../images/vert.png); 
    border-style: outset;
}
td.Pbleu{
    background-image:url(../images/bleu.png); 
    border-style: outset;
}
td.Pmauve{
    background-image:url(../images/mauve.png); 
    border-style: outset;
}
td.Porange{
    background-image:url(../images/orange.png); 
    border-style: outset;
}
td.Pjaune{
    background-image:url(../images/jaune.png); 
    border-style: outset;
}
td.Pnoir{
    background-image:url(../images/noir.png); 
    border-style: outset;
}
td.Pblanc{
    background-image:url(../images/blanc.png); 
    border-style: outset;
}



td.ranking{
    width: 200px;
    text-align: center;
    font-size: 1.2em;
    border-style: solid;
}

input[type=submit],
a.submit{
    background:#0459b7;
    background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
    background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
    border:1px solid #093c75;
    border-radius:3px;
    color:#fff;
    cursor:pointer;
    font-family:Arial,sans-serif;
    font-size:12px;
    font-weight:bold;
    padding: 5px 10px;
    text-decoration:none;
    text-shadow:0 1px 1px #333;
    text-transform:uppercase;
}

input[type=submit]:hover,
a.submit:hover{
    background:#08adff;
    background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
    background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
    border-color:#093c75;
    text-decoration:none;
}

input[type=submit]:active,
input[type=submit]:focus,
a.submit:active,
a.submit:focus{
    background:#ccc;
    background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
    background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
    border-color:#093c75;
    outline:none;
}

.stats{
    
    border:#000 1px;
    border-style: outset; 
    text-align: center;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}
.stats td{
        padding:10px; 
        border:#000 1px;
        border-style:inset;
}
.stats tr{
        background-color: transparent ;	    
	/* Fonctionne déjà sur webkit */
	-webkit-transition-property: background-color;
	-webkit-transition-duration: 1s;
				
        /*Fonctionne déjà sur Firefox */
        -moz-transition-property: background-color;
	-moz-transition-duration: 1s;

	/* Fonctionne déjà sur Opéra */
        -o-transition-property: background-color;
	-o-transition-duration: 1s;
				
        /* … et lorsque ce sera standardisé */
        transition-property: background-color;
        transition-duration: 1s;
}
.stats tr:hover,.stats tr:focus {
	background-color:#7878d7}
#accordion{
    width: 800px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    
}

.help{
    text-align: justify;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    font-size: 1.2em;
    
}